<span page-title>{{ 'New Environment' | translate }}</span>

<section class="details-page" ng-cloak>

  <ol class="breadcrumb">
    <li>
      <a ui-sref="environments" translate>Environments List</a>
    </li>

    <li class="active">
      <a translate>
        New Environment
      </a>
    </li>
  </ol>

  <header>
    <h1 translate>New Environment</h1>
  </header>

  <div bst-alerts success-messages="successMessages" error-messages="errorMessages"></div>

  <div ng-show="loading" class="loading-mask">
    <i class="fa fa-spinner fa-spin"></i>
      {{ "Loading..." | translate }}
  </div>

  <div ng-show="!loading" class="row">

    <p class="col-sm-12" translate>Adding Lifecycle Environment to the end of "{{ priorEnvironment.name }}"</p>

    <form name="environmentForm" class="col-sm-5" novalidate role="form">
      <div bst-form-group label="{{ 'Name' | translate }}">
        <input id="name"
               name="name"
               ng-model="environment.name"
               type="text"
               tabindex="1"
               autofocus
               required/>
      </div>

      <div bst-form-group label="{{ 'Label' | translate }}">
        <input id="label"
               name="label"
               ng-model="environment.label"
               type="text"
               tabindex="2"
               required/>
      </div>

      <div bst-form-group label="{{ 'Description' | translate }}">
        <textarea id="description"
                  name="description"
                  ng-model="environment.description"
                  tabindex="3">
        </textarea>
      </div>

      <div bst-form-group label="{{ 'Prior Environment' | translate }}"
           ng-show="currentPath != null">
        <select id="prior_id"
                name="prior_id"
                ng-model="environment.prior_id"
                ng-options="env.id as env.name for env in currentPath"
                tabindex="4">
        </select>
      </div>

      <div bst-form-buttons
           on-cancel="transitionTo('environments')"
           on-save="save(environment)"
           working="working">
      </div>
    </form>
  </div>

</section>
